﻿
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
    <head>
        <title>Deal14</title>
        <meta http-equiv="content-type" content="text/javascript;charset=UTF-8" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <style>
            
.jfk-bubble {
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 3px rgba(0,0,0,.2);
box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
background-color: white;
border: 1px solid;
border-color: #BBB #BBB #A8A8A8;
padding: 16px;
position: absolute;
z-index: 1201!important;
}
.jfk-bubble.jfk-bubble-promo {
background-color: #F9EDBE;
border: 1px solid #F0C36D;
}

.jfk-bubble-arrowup {
top: -9px;
}

.jfk-bubble{-webkit-box-shadow:0 1px 3px rgba(0,0,0,.2);-moz-box-shadow:0 1px 3px rgba(0,0,0,.2);box-shadow:0 1px 3px rgba(0,0,0,.2);background-color:#fff;border:1px solid;border-color:#bbb #bbb #a8a8a8;padding:16px;position:absolute;z-index:1201!important}
.jfk-bubble-closebtn{background:url("https://ssl.gstatic.com/ui/v1/icons/common/x_8px.png") no-repeat;border:1px solid transparent;height:21px;opacity:.4;outline:0;position:absolute;right:2px;top:2px;width:21px}
.jfk-bubble-closebtn:focus,.jfk-bubble-closebtn:hover{border:1px solid #4d90fe;opacity:.8}

.jfk-bubble-arrow{position:absolute}
.jfk-bubble-arrow .jfk-bubble-arrowimplbefore,.jfk-bubble-arrow .jfk-bubble-arrowimplafter{display:block;height:0;position:absolute;width:0}
.jfk-bubble-arrow .jfk-bubble-arrowimplbefore{border:9px solid}
.jfk-bubble-arrow .jfk-bubble-arrowimplafter{border:8px solid}
.jfk-bubble-arrowdown{bottom:0}
.jfk-bubble-arrowup{top:-9px}
.jfk-bubble-arrowleft{left:-9px}
.jfk-bubble-arrowright{right:0}
.jfk-bubble-arrowdown .jfk-bubble-arrowimplbefore,.jfk-bubble-arrowup .jfk-bubble-arrowimplbefore{border-color:#bbb transparent;left:-9px}
.jfk-bubble-arrowdown .jfk-bubble-arrowimplbefore{border-color:#a8a8a8 transparent}
.jfk-bubble-arrowdown .jfk-bubble-arrowimplafter,.jfk-bubble-arrowup .jfk-bubble-arrowimplafter{border-color:#fff transparent;left:-8px}
.jfk-bubble-arrowdown .jfk-bubble-arrowimplbefore{border-bottom-width:0}
.jfk-bubble-arrowdown .jfk-bubble-arrowimplafter{border-bottom-width:0}
.jfk-bubble-arrowup .jfk-bubble-arrowimplbefore{border-top-width:0}
.jfk-bubble-arrowup .jfk-bubble-arrowimplafter{border-top-width:0;top:1px}
.jfk-bubble-arrowleft .jfk-bubble-arrowimplbefore,.jfk-bubble-arrowright .jfk-bubble-arrowimplbefore{border-color:transparent #bbb;top:-9px}
.jfk-bubble-arrowleft .jfk-bubble-arrowimplafter,.jfk-bubble-arrowright .jfk-bubble-arrowimplafter{border-color:transparent #fff;top:-8px}
.jfk-bubble-arrowleft .jfk-bubble-arrowimplbefore{border-left-width:0}
.jfk-bubble-arrowleft .jfk-bubble-arrowimplafter{border-left-width:0;left:1px}
.jfk-bubble-arrowright .jfk-bubble-arrowimplbefore{border-right-width:0}
.jfk-bubble-arrowright .jfk-bubble-arrowimplafter{border-right-width:0}
.jfk-bubble.jfk-bubble-promo{background-color:#f9edbe;border:1px solid #f0c36d}
.jfk-bubble-promo .jfk-bubble-arrowdown .jfk-bubble-arrowimplbefore,.jfk-bubble-promo .jfk-bubble-arrowup .jfk-bubble-arrowimplbefore{border-color:#f0c36d transparent}
.jfk-bubble-promo .jfk-bubble-arrowdown .jfk-bubble-arrowimplafter,.jfk-bubble-promo .jfk-bubble-arrowup .jfk-bubble-arrowimplafter{border-color:#f9edbe transparent}
.jfk-bubble-promo .jfk-bubble-arrowleft .jfk-bubble-arrowimplbefore,.jfk-bubble-promo .jfk-bubble-arrowright .jfk-bubble-arrowimplbefore{border-color:transparent #f0c36d}
.jfk-bubble-promo .jfk-bubble-arrowleft .jfk-bubble-arrowimplafter,.jfk-bubble-promo .jfk-bubble-arrowright .jfk-bubble-arrowimplafter{border-color:transparent #f9edbe}

.jfk-bubble.jfk-bubble-promo.gray {background-color: #Fafafa;border: 1px solid #ddd;}
.jfk-bubble.jfk-bubble-promo.gray .jfk-bubble-arrowimplbefore{border-color:#ccc transparent}
.jfk-bubble.jfk-bubble-promo.gray .jfk-bubble-arrowimplafter{border-color:#fafafa transparent}

.jfk-bubble.jfk-bubble-promo.white {background-color: #fff;border: 1px solid #ddd;}
.jfk-bubble.jfk-bubble-promo.white .jfk-bubble-arrowimplbefore{border-color:#ccc transparent}
.jfk-bubble.jfk-bubble-promo.white .jfk-bubble-arrowimplafter{border-color:#fff transparent}

.classic-button{ 
    padding: 2px 20px;
    border: 1px solid #ccc;
    line-height: 16px;
    height: 22px;
    margin: 0;outline: none;
    background-color: #E8E8E8;
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#FAFAFA),to(#DADADA));
    background-image: -moz-linear-gradient(top,#FAFAFA,#DADADA);
    background-image: -o-linear-gradient(top,#FAFAFA,#DADADA);
}
.classic-button:focus,.classic-button:hover{
    background: #ccc;border: 1px solid #aaa;
    background-color: #DADADA;
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#DADADA),to(#FAFAFA));
    background-image: -moz-linear-gradient(top,#DADADA,#FAFAFA);
    background-image: -o-linear-gradient(top,#DADADA,#FAFAFA);
}
.classic-button:active{background: #ccc;}
.jfk-bubble *{font-family: tahoma;font-size: 11px;}  
        </style>
    </head>
    <body>
        
<script>
function jqxAjax(surl,sdata,callback){
    var code=-2;
    jQuery.ajax({
            type:"POST", 
            data:sdata, 
            dataType:"text", 
            url:surl, 
            success: function (data){
                try{
                    var result = $.parseJSON(data);
                    if(result.code>=0){
						//alert("Thông báo: "+result.msg);
						
					}else{
                        //alert("Thông báo: "+result.msg);
                        
                    }
                    if (callback && typeof(callback) === "function") { 
                        try{
                            callback(result);  
                        }catch(e){
                            
                        }
                    } 
                }catch(err){
                    alert("JSON Error:"+err.message+"<br/>Content: "+data);
                    
                }
            },
            error: function (xhr, ajaxOptions, thrownError){
                alert("<b>Status</b>:"+xhr.status+"<br/><b>ThrownError</b>:"+thrownError+"<br/>"+surl);
            }
    });
}
function loginnk(f){
	var username=$("#txt-uname-login").val();
	var password=$("#txt-pass-login").val();
	var surl="http://thanma.gosu.vn/events/giftcodetmg/login";
	var sdata={
			"username"    :   username,
			"password"    :   password,
			"params":JSON.stringify({
					"username"    :   username,
					"password"    :   password
			})
	};
        $(".logintmgbtn").attr("disabled", "disabled");
        $(".logintmgbtn").val("Login...");
	jqxAjax(surl,sdata,function(result){
		if(result.code>=0){
			$("#txt-uname-login").val("");
                        $("#txt-pass-login").val("");
			$("#tb-gift").show();
			$("#tb-login").hide();
			$(".lblusername").html(result.UserName);
			$(".lblgiftcode").html(result.Giftcode);
                        $(".logintmgbtn").removeAttr("disabled");
                        $(".logintmgbtn").val("Login");
		}else{
			if(!f){
                            $(".jfk-bubble.jfk-bubble-promo.notice .promo-content").html("Thông báo: "+result.msg);
                            $(".jfk-bubble.jfk-bubble-promo.notice").show();
                        }
                        $(".logintmgbtn").removeAttr("disabled");
                        $(".logintmgbtn").val("Login");
		}
	});
	//$(".logintmgbtn").removeAttr("disabled");
        //$(".logintmgbtn").val("Login");
}
function logoutnk(){
	var surl="http://thanma.gosu.vn/events/giftcodetmg/logout";
	var sdata={
	};
	var aj=jqxAjax(surl,sdata,function(result){
		if(result.code>=0){
                        $("#tb-gift").hide();
			$("#tb-login").show();
                        $(".jfk-bubble.jfk-bubble-promo.notice").hide();
		}else{
			$(".jfk-bubble.jfk-bubble-promo.notice .promo-content").html("Thông báo: "+result.msg);
                        $(".jfk-bubble.jfk-bubble-promo.notice").show();
		}
	});
	
}
function GetGiftcode(){
	var surl="http://thanma.gosu.vn/events/giftcodetmg/getgiftcode";
	var sdata={
	};
	var aj=jqxAjax(surl,sdata,function(result){
		if(result.code>=0){
			$(".lblgiftcode").html(result.Giftcode);
		}else{
			$(".jfk-bubble.jfk-bubble-promo.notice .promo-content").html("Thông báo: "+result.msg);
                        $(".jfk-bubble.jfk-bubble-promo.notice").show();
		}
	});
}
        
$(document).ready(function () {
	loginnk(true);
        $(".notice.btn").click(function(){
            $(".jfk-bubble.jfk-bubble-promo.notice").hide();
        });
});
function showlogin(){
    $(".jfk-bubble.jfk-bubble-promo.login").fadeIn(500);
}     
function hidelogin(){
    $(".jfk-bubble.jfk-bubble-promo.login").fadeOut(500);
} 

</script>
        <span style="" onclick="showlogin();">Login</span>             
<div class="jfk-bubble jfk-bubble-promo login" 
     style="visibility: visible; position:absolute;top:50%;left:50%; opacity: 1;
     margin-left:-100px;margin-top:-100px;display: none">
        
                <div class="jfk-bubble jfk-bubble-promo gray notice" 
                     style="visibility: visible; left: 4px; bottom: 60px; opacity: 1;display: none;">
                    <div class="jfk-bubble-closebtn notice btn"></div>
                    <div class="jfk-bubble-content-id">
                        <div class="promo-content" style="width: 200px; ">
                            Thông báo<br/>
                            a-z
                        </div>
                    </div>
                    <div class="jfk-bubble-arrow-id jfk-bubble-arrow jfk-bubble-arrowdown" style="left: 114px">
                        <div class="jfk-bubble-arrowimplbefore"></div>
                        <div class="jfk-bubble-arrowimplafter"></div>
                    </div>
                </div>
    
	<div class="jfk-bubble-content-id">
		<div class="promo-content" style="">
			<form method="post" onsubmit="loginnk();return false;">        
				<table style="" id="tb-login">            
					<tr>                
                                            <td style="">                    
							<input type="text" id="txt-uname-login" class="text-input" style="width: 200px;padding:3px 4px;" value="" placeholder="User Name">                
						</td>            
					</tr>            
					<tr>                
						<td>                    
							<input type="password" id="txt-pass-login" class="text-input" style="width: 200px;padding:3px 4px;" value=""  placeholder="Pass">                
						</td>            
					</tr>            
					<tr>                
						<td style="text-align:center">                    
                                                    <input type="submit" value="Login"  onclick="" class="classic-button logintmgbtn" style="">                    
                                                    <input type="button" value="Cancel" onclick="hidelogin();" class="classic-button" style="">                
						</td>            
					</tr>       
				</table>
				<table style="display:none;" id="tb-gift">            
					<tr>                
						<td class="lblusername">                    
							Chào bạn : <b>Khương Trường</b>
						</td>            
					</tr>            
					<tr>                
						<td class="lblgiftcode" style="background:#F0C36D;;width:200px;padding:3px 4px;font-size:20px;font-family:arial;font-weight:bold;text-align:center;height:28px">                    
							
						</td>            
					</tr>            
					<tr>                
						<td style="text-align:center;padding-top: 8px" >                    							
							<input type="button" value="Logout" onclick="logoutnk();" class="classic-button" style="">                
						</td>            
					</tr>       
				</table>
			</form>
		</div>
	</div>
	<div class="jfk-bubble-arrow-id jfk-bubble-arrow jfk-bubble-arrowup" style="left: 114px">
		<div class="jfk-bubble-arrowimplbefore"></div>
		<div class="jfk-bubble-arrowimplafter"></div>
	</div>
</div>        
    </body>
</html>